/*********** VAR*******/

var time = 3; // temps entre l'affichage de 2 pos du robot
var mapWidth = 100;
var mapHeight = 100;
var coeffBut = -99; // mettre le mm que dans main.c

var canvas = $('#drawingArea');
var cWidth = canvas[0].width;
var cHeight = canvas[0].height;		
var coeffX = cWidth/mapWidth;
var coeffY = cHeight/mapHeight;						
var context = canvas.get(0).getContext('2d');
context.lineWidth = 4;
context.strokeStyle = "blue";
context.lineCap = "round";

var plotDot = function(x, y){
    plotLine(x, y, 1);
}

var plotRect = function(startX, startY, sizeX, sizeY){
    context.beginPath();
    context.fillStyle = "black";
    context.fillRect(startX , startY, sizeX, sizeY);
    context.closePath();
}

var plotLine = function(x, y, size){
    context.beginPath();
    context.moveTo(x, y); 
    context.lineTo(x+size, y); //lineTo ends the line ( coords of the final pixelStartint)
    context.stroke();
    context.closePath();
}

var trajectoire = new Array();
var trajectoireDij = new Array();
var index = 0;
var indexDij = 0;
var clock;
var clock2;
var coeff; // coeff between grid && canvas

var pot = false;
var canvasPot;

var plotTraj = function() {
    plotDot(trajectoire[index][0]*coeffX+coeffX/2, trajectoire[index][1]*coeffY+coeffY/2);
    if (index >= trajectoire.length-1) {
        clearInterval(clock);
    }
    index++;
}
var plotTrajDij = function() {
    plotDot(trajectoireDij[indexDij][0]*coeffX+coeffX/2, trajectoireDij[indexDij][1]*coeffY+coeffY/2);
    if (indexDij === trajectoireDij.length-1) {
        clearInterval(clock2);
    }
    indexDij++;
}

var displayTraj = function(mapName, dijkstra) {
    if (!dijkstra) {
        $.getJSON('jsons/trajectoire-'+mapName+'.json', function(data) {
            for (var i in data.trajectoire) {
                var trajectoireTmp = new Array();
                trajectoireTmp[0] = data.trajectoire[i].x;
                trajectoireTmp[1] = data.trajectoire[i].y;
                trajectoire[i] = trajectoireTmp;
            }

            context.strokeStyle = "blue";
            index = 0;
            clock = setInterval("plotTraj()", time);
        });
    } else {
        $.getJSON('jsons/trajectoire-dijkstra-'+mapName+'.json', function(data) {
            for (var i in data.trajectoire) {
                var trajectoireDijTmp = new Array();
                trajectoireDijTmp[0] = data.trajectoire[i].x;
                trajectoireDijTmp[1] = data.trajectoire[i].y;
                trajectoireDij[i] = trajectoireDijTmp;
            }

            context.strokeStyle = "blue";
            indexDij = 0;
            clock2 = setInterval("plotTrajDij()", time);
        });
    }
}


var displayResults = function(mapName) {
    $.getJSON('jsons/map-'+mapName+'.json', function(data) {
        for (var i in data.map) {
            if (data.map[i].val === coeffBut) {
                context.lineWidth = 20;
                context.strokeStyle = "red";
                plotDot(data.map[i].x*coeffX+coeffX/2, data.map[i].y*coeffY+coeffY/2);
                context.lineWidth = 4;
            } else {            
                context.strokeStyle = "black";
                plotRect(data.map[i].x*coeffX, data.map[i].y*coeffY, coeffX, coeffY);
            }
        }
    });

    $.getJSON('jsons/potentials-'+mapName+'.json', function(data) {
        var xx = h337.create({"element":document.getElementById("heatmapArea"), "radius":13, "visible":false});
        xx.store.setDataSet(data);
        canvasPot = $('#canvasPot');
        pot = true;
    });
}

var displayPot = function() {
    if (pot) {
        canvasPot.toggle();
    }
}

function setCookie(sName, sValue) {
    var today = new Date(), expires = new Date();
    expires.setTime(today.getTime() + (365*24*60*60*1000)); // expire dans 1an
    document.cookie = sName + "=" + encodeURIComponent(sValue) + ";expires=" + expires.toGMTString();
}

function getCookie(sName) {
    var cookContent = document.cookie, cookEnd, i, j;
    var sName = sName + "=";

    for (i=0, c=cookContent.length; i<c; i++) {
        j = i + sName.length;
        if (cookContent.substring(i, j) == sName) {
            cookEnd = cookContent.indexOf(";", j);
            if (cookEnd == -1) {
                cookEnd = cookContent.length;
            }
            return decodeURIComponent(cookContent.substring(j, cookEnd));
        }
    }
    return null;
}

var map;
var mapSelect = $('#mapSelect select');
var cookieMap = getCookie("mapCookie");
if (cookieMap !== null)
    map = cookieMap;
else
    map = "default";

mapSelect.val(map);
if (map.indexOf("grille") > -1) {
    $('#buttonDij').attr("disabled", false);
} else {
    $('#buttonDij').attr("disabled", true);
}
setCookie("mapCookie", map);
displayResults(map);
displayTraj(map, false);

mapSelect.change(function() {
    map = $(this).val();
    setCookie("mapCookie", map);
	if (pot)
		location.reload(); // recharge page si on change
    displayResults(map);
    displayTraj(map, false);
});


var displayDijkstra = function() {
    displayTraj(map, true);
}

